<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<%@ page import="com.pmsco.pms.core.constant.PmsConstant"%>
<%@ page import="com.pmsco.pms.util.BundleUtil"%>
<%@ include file="/WEB-INF/import/tagLibs.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<%@ include file="/WEB-INF/import/jqGridCssAndJavascript.jsp" %>
</head>
<body class="pmsMainBody">
	<table class="pmsMainTable">
		<tr class="pmsMainTableWrapperTd">
			<td>
				<table id="userList">
					<tr>
						<td>User data list will be show here</td>
					</tr>
				</table>
				<div id="userPager"></div>
			</td>
		</tr>
		<tr>
			<td>
				<table align="center">
					<tr>
						<td>
							<button id="createUser" class="tableFormButton" onclick="submitAction('<%=PmsConstant.createUser_JspUrl%>')"><spring:message code="button.create"/></button>
						</td>
					</tr>
				</table>
			</td>
		</tr>
	</table>
</body>
<script type="text/javascript">
	$("#userList").jqGrid({
		url: '<%=PmsConstant.listUserData_JspUrl%>',
		datatype: "json",
		autowidth: true,
		height: 500,
		jsonReader : { 
		      root: "rows", 
		      page: "page", 
		      total: "total", 
		      records: "records", 
		      repeatitems: false, 
		      cell: "", 
		      id: "userName",
		      userdata: ""
		   },
		colNames: [
        	'<%=BundleUtil.getInstance().getKey("user.lastName")%>',
        	'<%=BundleUtil.getInstance().getKey("user.midName")%>',
        	'<%=BundleUtil.getInstance().getKey("user.firstName")%>',
        	'<%=BundleUtil.getInstance().getKey("user.userName")%>',
        	'<%=BundleUtil.getInstance().getKey("user.role")%>',
        	'<%=BundleUtil.getInstance().getKey("user.idNumber")%>',
        	'<%=BundleUtil.getInstance().getKey("user.dob")%>',
        	'<%=BundleUtil.getInstance().getKey("user.cellPhone")%>',
        	'<%=BundleUtil.getInstance().getKey("user.emailAddr")%>'
       	],
		colModel: [
		    {name: 'lastName', index: 'lastName', width: 10, sorttype: "string"},
		    {name: 'midName', index: 'midName', width: 15, sorttype: "string"},
		    {name: 'firstName', index: 'firstName', width: 10, sorttype: "string"},
		    {name: 'userName', index: 'userName', width: 10, sorttype: "string"},
		    {name: 'pmsRole', index: 'pmsRole', width: 10, sorttype: "string"},
		    {name: 'idNumber', index: 'idNumber', width: 10, sorttype: "string"},
		    {name: 'dob', index: 'dob', width: 10, sorttype: "date"},
		    {name: 'cellPhone', index: 'cellPhone', width: 10, sorttype: "string"},
		    {name: 'emailAddr', index: 'emailAddr', width: 15, sorttype: "string"}
	    ],
	    rowNum:10, 
	    rowList:[10,20,30],
	    viewrecords: true,
	    pager: '#userPager',
	    sortorder: "desc",
	    sortname: 'lastName',
	    onSelectRow: function(rowid) {
	    	submitAction("<%=PmsConstant.editUser_JspUrl%>" + "?userName=" + rowid);
	    }
	});

	//hide caption bar. no need this bar
	jQuery("#userList").jqGrid('navGrid','#userPager', {edit:false, add:false, del:false});
	$("#userList > .ui-jqgrid-titlebar").hide();
	$("#createUser").button();
</script>
</html>